<html>
    <head>
        <script language="JavaScript" type="text/javascript" src="ajax.js"></script>
        <script language="JavaScript" type="text/javascript">
        function makeactive(tab)
        {
         document.getElementById("tab1").className = "Bandbreedte per periode";
         document.getElementById("tab2").className = "Bandbreedte per gebruiker";
         document.getElementById("tab3").className = "Bandbreedte per authenticatie";
         document.getElementById("tab4").className = "Bandbreedte per domein";
         document.getElementById("tab5").className = "";
         document.getElementById("tab"+tab).className = "active";
         document.getElementById('right').innerHTML = '';
         callAjax('content_users.php?content= '+tab+'&cache='+Math.random(), 'content', 'Content wordt geladen voor '+tab+'. Even geduld...', 'Error');
        }
        function getDetail(url)
        {
         callAjax(url + '&cache='+Math.random(), 'right', 'Content wordt geladen. Even geduld...', 'Error');
        }
        </script>
        <link rel="stylesheet" type="text/css" href="tab_users.css" />
        <style type="text/css">
        table.border1px {
            border-collapse: collapse;
            border: 1px solid #000000;
        }
        table.border1px td {
            border: 1px solid #000000;
            padding: 3px;
        }
        </style>
    </head>
    <body onload="makeactive(1)">


<ul id="tabmenu">
<li onclick="makeactive(1)"><a class="" id="tab1">Vandaag</a></li>
<li onclick="makeactive(2)"><a class="" id="tab2">Gisteren</a></li>
<li onclick="makeactive(3)"><a class="" id="tab3">7 dagen</a></li>
<li onclick="makeactive(4)"><a class="" id="tab4">Deze maand</a></li>
<li onclick="makeactive(5)"><a class="" id="tab5">Vorige maand</a></li>
</ul>
<div style="" id="content2">
    <div style="float:left;width:500px;" id="content"></div>
    <div style="float:left;padding: 20px;" id="right"></div>
</div>
</body>
</html>